import AJAX from '@/utils/ajax'
import '@/utils/base64.min'
import authcode from '@/utils/authcode'
import Player from '@/utils/play'
import { firstNumber } from '@/utils'

class Play {
  constructor() {
    $('body').on('click', '.d-play-pop-title span', function () {
      $('.d-play-pop').hide()
    })
  }
  /**
   *
   * @param {object} obj {id: 1, type: 'iqiyi', pid: 1, elem: dom, y: top}
   */

  play(obj) {
    const { id, type, pid, elem, y } = obj
    elem.css({ top: y + 30, display: 'block' })
    if (pid) {
      AJAX({ url: 'play', data: { id, pid } }).then((res) => {
        const { list, key } = res.data
        const html = list.map(
          ({ playName, playTitle, vid }) => `<li><a href="${Player(type, authcode(atob(vid), 'DECODE', key, 0))}" target="_blank"><i class="${playName}"></i>${playTitle}</a></li>`
        )
        elem.html(html.join(''))
      })
    } else {
      AJAX({ url: 'play', data: { id, type } }).then((res) => {
        const { list, key, playName, playTitle } = res.data
        const html = list.map(({ vid, title }) => `<a href="${Player(playName, authcode(atob(vid), 'DECODE', key, 0))}" target="_blank">${firstNumber(title)}</a>`)
        elem.html(`<div class="d-play-pop-title"><span>✕</span><h3>${playTitle}</h3></div><div class="d-play-pop-list">${html.join('')}</div>`)
      })
    }
  }
}

export default Play
